<!DOCTYPE html> <!-- 声明文档类型为HTML5 -->
<html lang="en"> <!-- 设置文档语言为英语 -->
<head>
    <meta charset="UTF-8"> <!-- 设置字符编码为UTF-8 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 设置视口宽度为设备宽度，初始缩放比例为1 -->
    <title>小米账号登录</title> <!-- 设置网页标题 -->
    <link rel="stylesheet" href="登陆页面.css"> <!-- 引入外部CSS样式表 -->
</head>
<body>
    <div class="login-container"> <!-- 登录容器 -->
        <div class="header"> <!-- 头部 -->
            <img src="C:\Users\Liangzc\Desktop\xiaomi-official-website-master\img\小米.jpg" alt="小米Logo" class="logo"> <!-- Logo图片 -->
            <h2>小米账号</h2> <!-- 标题 -->
        </div>
        <div class="tabs"> <!-- 标签页 -->
            <a href="#" class="active">登录</a> <!-- 登录链接 -->
            <a href="#">注册</a> <!-- 注册链接 -->
        </div>
        <form> <!-- 表单 -->
            <div class="form-group"> <!-- 表单组 -->
                <input type="text" name="username" placeholder="邮箱/手机号码/小米ID" required> <!-- 用户名输入框 -->
            </div>
            <div class="form-group"> <!-- 表单组 -->
                <input type="password" name="password" placeholder="密码" required> <!-- 密码输入框 -->
            </div>
            <div class="form-group"> <!-- 表单组 -->
                <input type="checkbox" id="agreement"> <!-- 复选框 -->
                <label for="agreement">已阅读并同意<a href="#">小米账号用户协议</a>和<a href="#">隐私政策</a></label> <!-- 用户协议链接 -->
            </div>
            <button type="button" class="login-button" onclick="redirectToIndex()">登录</button> <!-- 登录按钮 -->
        </form>
        <div class="links"> <!-- 链接区域 -->
            <a href="#">忘记密码？</a> <!-- 忘记密码链接 -->
            <a href="#">手机号登录</a> <!-- 手机号登录链接 -->
        </div>
        <div class="other-login-methods"> <!-- 其他登录方式 -->
            <p>其他方式登录</p> <!-- 标题 -->
            <div class="icons"> <!-- 图标容器 -->
                <img src="C:\Users\Liangzc\Desktop\xiaomi-official-website-master\img\支付宝.jpg" alt="支付宝"> <!-- 支付宝图标 -->
                <img src="C:\Users\Liangzc\Desktop\xiaomi-official-website-master\img\微信.jpg" alt="微信"> <!-- 微信图标 -->
                <img src="C:\Users\Liangzc\Desktop\xiaomi-official-website-master\img\QQ.jpg" alt="QQ"> <!-- QQ图标 -->
                <img src="C:\Users\Liangzc\Desktop\xiaomi-official-website-master\img\微博.jpg" alt="微博"> <!-- 微博图标 -->
            </div>
        </div>
        <div class="footer"> <!-- 页脚 -->
            <p>小米公司版权所有-京ICP备10046444号-京公网安备11010802020134号-京ICP证110507号</p> <!-- 版权信息 -->
        </div>
    </div>
    <script> // 脚本
        function redirectToIndex() { // 定义跳转跳函数
            window.location.href = 'index.html'; // 设置当前窗口的location属性为指定的URL
        }
    </script>
</body>
</html>